<template>
  <viDialog
    :deptShow="true"
    :visibility.sync="visibility"
    title="账户余额"
    unit="万元"
    :deptList="deptList"
    @changeDept="changeDept"
  >
    <div class="content-body">
      <viBalance 
      ref="balance"
      :accoutTagList="accoutTagList"
      :balanceList="balanceList" :showHeader="true" height="300px" />
    </div>
  </viDialog>
</template>

<script>
import { viDialog, viBalance } from "@/components/visualization/index";
import request from "@/utils/request";
import Qs from "qs";
export default {
  name: "vi-popup-balance",
  components: {
    viDialog,
    viBalance
  },
  props: {
    deptList: {
      default: () => []
    },
    accoutTagList:{
      default:()=>[],
    },
  },
  data() {
    return {
      visibility: false,
      balanceList: []
    };
  },
  methods: {
    open(data) {
      this.balanceList = JSON.parse(JSON.stringify(data));
      this.visibility = true;
      this.screenBalance()
    },
    changeDept(val) {
      this.screenBalance(val);
    },
    screenBalance(deptId = this.deptId) {
      request({
        url: "/system/screen/balance",
        method: "post",
        headers: { "content-type": "application/x-www-form-urlencoded" },
        data: Qs.stringify({
          deptId
        })
      }).then(res => {
        /**
         * saleAmount  销售额
         * currMonthIncome  本月新增收入
         * currYearIncome  今年累计收入
         * yearProfile  今年累计利润
         */
        this.$refs.balance.draw(res.data)
      });
    }
  }
};
</script>

<style scoped lang="scss">
.content-body{
  margin-top:10px;
}
</style>
